// 现代化主题色 - 紫蓝渐变系列
$base-color-primary: #6366f1;
$base-color-secondary: #8b5cf6;
$base-color-accent: #06b6d4;
$base-color-default: $base-color-primary;

// 扩展色彩系统
$base-color-success: #10b981;
$base-color-warning: #f59e0b;
$base-color-danger: #ef4444;
$base-color-info: #06b6d4;

// 中性色系统
$base-color-gray-50: #f9fafb;
$base-color-gray-100: #f3f4f6;
$base-color-gray-200: #e5e7eb;
$base-color-gray-300: #d1d5db;
$base-color-gray-400: #9ca3af;
$base-color-gray-500: #6b7280;
$base-color-gray-600: #4b5563;
$base-color-gray-700: #374151;
$base-color-gray-800: #1f2937;
$base-color-gray-900: #111827;

// 渐变背景色
$base-gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
$base-gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
$base-gradient-accent: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
$base-gradient-dark: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
$base-gradient-success: linear-gradient(135deg, #10b981 0%, #059669 100%);
$base-gradient-warning: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
$base-gradient-danger: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);

// 卡片渐变背景
$base-gradient-card: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.7) 100%);
$base-gradient-card-hover: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.9) 100%);

// 默认层级
$base-z-index: 999;

// 横向布局纵向布局时菜单背景色 - 深色渐变
$base-menu-background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);

// 菜单文字颜色
$base-menu-color: rgba(255, 255, 255, 0.9);

// 菜单选中文字颜色
$base-menu-color-active: #ffffff;

// 菜单选中背景色 - 渐变效果
$base-menu-background-active: $base-gradient-primary;
$base-color-blue: $base-color-primary;

// 标题颜色
$base-title-color: #ffffff;

// 字体大小配置
$base-font-size-small: 12px;
$base-font-size-default: 14px;
$base-font-size-big: 16px;
$base-font-size-bigger: 18px;
$base-font-size-max: 22px;
$base-font-color: #606266;
$base-color-blue: $base-color-primary;
$base-color-green: #10b981;
$base-color-white: #ffffff;
$base-color-black: #1f2937;
$base-color-yellow: #f59e0b;
$base-color-orange: #f97316;
$base-color-red: #ef4444;
$base-color-gray: #6b7280;
$base-color-light-gray: #f8fafc;
$base-color-dark-gray: #374151;
$base-main-width: 1279px;

// 边框系统
$base-border-radius: 4px;
$base-border-radius-sm: 2px;
$base-border-radius-md: 6px;
$base-border-radius-lg: 8px;
$base-border-radius-xl: 12px;
$base-border-radius-2xl: 16px;
$base-border-radius-full: 9999px;

$base-border-color: #dcdfe6;
$base-border-color-light: #e4e7ed;
$base-border-color-lighter: #ebeef5;
$base-border-color-extra-light: #f2f6fc;

// 间距系统
$base-spacing-xs: 4px;
$base-spacing-sm: 8px;
$base-spacing-md: 12px;
$base-spacing-lg: 16px;
$base-spacing-xl: 20px;
$base-spacing-2xl: 24px;
$base-spacing-3xl: 32px;
$base-spacing-4xl: 40px;
$base-spacing-5xl: 48px;

// 输入框高度
$base-input-height: 32px;
$base-input-height-sm: 28px;
$base-input-height-lg: 36px;
$base-input-height-xl: 40px;

// 默认padding
$base-padding: 20px;
$base-padding-sm: 12px;
$base-padding-lg: 24px;
$base-padding-xl: 32px;

// 阴影系统
$base-box-shadow: 0 1px 4px rgb(0 21 41 / 8%);
$base-box-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
$base-box-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
$base-box-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
$base-box-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
$base-box-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
$base-box-shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
$base-box-shadow-none: none;

// 横向布局时top-bar、logo、一级菜单的高度
$base-top-bar-height: 60px;

// 纵向布局时logo的高度
$base-logo-height: 75px;

// 顶部nav-bar的高度
$base-nav-bar-height: 60px;

// 顶部多标签页tabs-bar的高度
$base-tabs-bar-height: 55px;

// 顶部多标签页tabs-bar中每一个item的高度
$base-tag-item-height: 34px;

// 菜单li标签的高度
$base-menu-item-height: 50px;

// 头部高度
$base-header-height: calc(#{$base-nav-bar-height} + #{$base-tabs-bar-height});

// app-footer高度
$base-app-footer-height: 55px;

// app-main的高度
$base-app-main-height: calc(
  100vh - $base-nav-bar-height - $base-tabs-bar-height - 56px - 40px
);

// 纵向布局时左侧导航未折叠时的宽度
$base-left-menu-width: 256px;

// 纵向布局时左侧导航未折叠时右侧内容的宽度
$base-right-content-width: calc(100% - #{$base-left-menu-width});

// 纵向布局时左侧导航已折叠时的宽度
$base-left-menu-width-min: 64px;

// 纵向布局时左侧导航已折叠时右侧内容的宽度
$base-right-content-width-min: calc(100% - #{$base-left-menu-width-min});

// 默认动画
$base-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border 0s,
  background 0s, color 0s, font-size 0s;

// 默认动画长
$base-transition-time: 0.3s;
